<!DOCTYPE html>
<html lang="ko">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<title>jscript01기초</title>
	</head>
	<body>
		<h1>자바스크립트 기본</h1>
		<h3>값, 변수</h3>
		<p>자바스크립트에는 6가지 종류의 값을 다룰 수 있음.<br />
				숫자형, 문자형, 블리언, 객체, 함수, 정의되지 않은 값</p>
		<p>숫자형은 연산자를 이용해서 산술식에 사용될 수 있음.</p>
		<p>문자형은 " " 또는 ' ' 로 정의함</p>
		<p>특수문자는 escape sequence로 처리함</p>
		<p>표현식과 문장의 차이 : 종결문자 ;의 존재여부</p>
		<h3>변수</h3>
		<p>변수 : 값을 저장하는 저장소</p>
		<p>변수 선언시 var 이라는 예약어를 사용</p>
		<p>자바와는 달리 변수의 자료형을 엄격히 검사하지 않기 때문에 변수 선언 및 초기화, 값 할당이 자유로움</p>
		<script type="text/javascript" \>
			var pi = 3.14;
			document.write( "var pi = " + pi + "<br />" );
			document.write( "pi X 123456 = " + ( pi * 123456 ) );
			pi = '수지 환영!';
			document.write( "<br />" + pi );
		</script>
		
		<h3>내장 함수</h3>
		<p>자바스크립트에서 자주 사용하는 기능을 작은 프로그램 조각으로 만들어 둔 것</p>
		<script type="text/javascript">
			// alert( "경고창을 띄우려면 alert 함수를 사용해야 함" );
			// prompt("크리스마스에 집에 있을껀가요?", "슬프지만, 예...." );
			document.write("2와 4중에 큰수는 " + Math.max(2, 4) );
		</script>
		
		<h3>조건문 : if</h3>
		<p>일반적으로 프로그램의 실행순서는 위에서 아래로 차례대로 내려가며 코드가 실행됨</p>
		<p>하지만, 블리언 조건식의 결과값에 따라 특정문장이 실행되거나 건너뛰게 할 수 있음</p>
		<!-- <script type="text/javascript">
			var myage = prompt("나이를 입력해보세요");
			document.write("입력한 나이 : " + myage);
			if ( myage < 10 ) { document.write("아주 어리시군요!");
			} else if ( myage < 20 ) { document.write("딱 좋을 때군요!");
			} else if ( myage < 30 ) { document.write("연애하기 좋을때군요~");
			} else if ( myage < 40 ) { document.write("결혼하기 좋을때군요~"); }
		</script> -->
		
		<h3>반복문</h3>
		<p>특정 코드를 자동으로 반복하는 수단 제공</p>
		<p>for : 반복횟수를 알고 있을 때</p>
		<p>while : 외부 요인에 의해 반복여부가 결정</p>
		<script type="text/javascript">
			document.write ( "수지 환영! + <br />" );
			document.write ( "수지 환영! + <br />" );
			document.write ( "수지 환영! + <br />" );
			document.write ( "수지 환영! + <br />" );
			document.write ( "수지 환영! + <br /><hr />" );
			
			for(var i = 1; i <= 5; i++ ) {
				document.write ( "수지 환영! + <br />" );
			}
			
			var i = 1;
			while(i <= 10 ) {
				document.write(i + "아이유 금지! <br . ) :");
				i++;
			}
		</script>
		
		<h3>Switch 문</h3>
		<p>if 문보다 보기좋고 사용하기 편한 다중 선택문</p>
		<!-- <script type="text/javascript">
		var msg='';
			switch ( prompt("좋아하는 여자 연애인은?") ) {
				case '수지' : msg = '탁월한 선택이시군요'; break; 
				case '혜교' : msg = '탁월한 선택이시군요'; break; 
				case '아이유' : msg = '탁월한 선택이시군요'; break;
				default : msg = '탁월한 선택이시군요' ;
			}
			document.write(msg);
		</script> -->
		
		<h3>자료형 검사 : typeof</h3>
		<p>변수의 자료형을 알려줌</p>
		<!-- <script type="text/javascript">
			alert( typeof ( 'abc' ) );  // string
			alert( typeof ( 12345 ) ); // number
			alert( typeof ( true ) ); // boolean
			alert( typeof ( function ( ) {} ) ); // function - 함수
			alert( typeof ( undefined ) ); // undefined
			alert( typeof ( new Date ( ) ) ); // object - 객체
		</script> -->
		
		<h3>undefined vs null</h3>
		<p>undefined : 변수는 선언하되 초기화되지 않은 경우</p>
		<p>null : 변수는 선언하되 초기화되지 않은 경우 -- 즉, 객체에 한정해서 참조가 없을 때 사용</p>
		<script type="text/javascript">
			var mylove;
			// alert( mylove );
			// alert( mylove == undefined );
			alert( typeof mylove ); // undefined
			mylove = null;
			alert( mylove == undefined ); // true
			alert( typeof mylove ); // object
		</script>
		
		<h3>서로 다른 자료형 비교 : 자동 형변환</h3>
		<p>== : 먼저 동일한 자료형으로 변환 후 비교</p>
		<p>=== : 자동 형변환 없이 두 값만을 비교</p>
		<script type="text/javascript">
			document.write( "false == 0 결과는 " + ( false == 0 ) + "<br />" );
			document.write( "'' == 0 결과는 " + ( '' == 0 ) + "<br />" );
			document.write( "'5' == 5 결과는 " + ( '5' == 5 ) + "<br />" );
			document.write( "7 == 7 결과는 " + ( 7 == 7 ) + "<br />" );
			document.write( "null == undefined " + ( null == undefined ) + "<br />" );
			
			document.write( "false === 0 결과는 " + ( false === 0 ) + "<br />" );
			document.write( "'' === 0 결과는 " + ( '' === 0 ) + "<br />" );
			document.write( "'5' === 5 결과는 " + ( '5' === 5 ) + "<br />" );
			document.write( "7 === 7 결과는 " + ( 7 === 7 ) + "<br />");
			document.write( "null === undefined " + ( null === undefined ) + "<br />" );
		</script>
		
		<h3>NaN : not a number</h3>
		<p>표현식의 결과값이 숫자값으로 표현하기 어려운 경우</p>
		<p>ECMAScript에서는 isNaN 함수를 제공함 -- 표현식의 결과값을 숫자값으로 확인 가능한지 여주 검사</p>
		<script type="text/javascript">
			document.write('mylove' + 100 + "<br />" );
			document.write( ( 100 * 0 ) + "<br />" );
			document.write( isNaN(NaN) + "<br />" );
			document.write( isNaN(10) + "<br />" );
			document.write( isNaN("10") + "<br />" );
			document.write( isNaN("blue") + "<br />" );
			document.write( isNaN(true) + "<br />" );
		</script>
		
		<!--
			JavaScript : EMCAScript 5
			EMCA가 표준화한  스크립트 언어
			웹 브라우저의 여러 부분과 속성들을 쉽게 제어할 수 있고(BOM), html 문서와 CSS도 동적으로 다룰 수 있게 해 줌(DOM)
		 -->
	</body>
</html>